<!-- 合同存档清单 -->
<template>
	<div class="t-wp" v-loading="state.loading">
		<el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
			<el-form class="text-right" :inline="true">
				<el-form-item>
					<el-button type="primary" icon="ele-Plus" @click="exportExcel()"> 导出 </el-button>
					<el-button type="primary" @click="downFiles()">导出合同文件</el-button>
				</el-form-item>
			</el-form>
		</el-card>
		<el-card class="full-table" shadow="hover" style="margin-top: 8px">
			<el-table :data="state.list" style="width: 100%" border>
				<el-table-column type="index" label="序号" width="55" align="center" />
				<el-table-column prop="contrackCode" label="编号" align="center" show-overflow-tooltip />
				<el-table-column prop="contrackName" label="合同名称" align="center" show-overflow-tooltip />
				<el-table-column prop="signedDeprt" label="合同签订部门" align="center" show-overflow-tooltip />
				<el-table-column prop="providerName" label="合同签订方名称" align="center" show-overflow-tooltip />
				<el-table-column prop="signedDate" label="签订时间" align="center" show-overflow-tooltip />
				<el-table-column prop="description" label="主要内容" align="center" show-overflow-tooltip />
				<el-table-column prop="contractAmount" label="合同金额" align="center" show-overflow-tooltip />
				<el-table-column prop="contractStatus" align="center" show-overflow-tooltip width="300">
					<template #header>
						合同履行情况<br/>(含结算金额、账面已付金额、未付金额)
					</template>
					<template #default="scope">
						{{getLabelByValue(state.contractStatusList, scope.row.contractStatus, '', 'value', 'code')}}
					</template>
				</el-table-column>
				<!-- <el-table-column label="操作" width="300" align="center" fixed="right" show-overflow-tooltip>
					<template #default="scope">
						<el-button size="small" text type="primary" @click="toAuditForm(scope.row)">去审核</el-button>
					</template>
				</el-table-column> -->
			</el-table>
		</el-card>
	</div>
</template>

<script setup name="SupplierManage">
import { onMounted, reactive, ref } from 'vue';
import {useRouter, useRoute} from "vue-router";
import { ElMessage, ElMessageBox, ElNotification } from 'element-plus';
import {$get, $post, $postparams} from '/@/utils/request';
import {getLabelByValue} from "/@/utils/Tools.js";
import {downloadByUrl} from "/@/utils/download.ts";
import * as XLSX from "xlsx-js-style";

const router = useRouter();
const route = useRoute();

const state = reactive({
	loading: false,

	list: [],

	contractStatusList: [],

});

onMounted(async () => {
	handleQuery();

	// 获取合同履行类型
	getContractStatus();
});

// 查询操作
const handleQuery = async () => {
	state.loading = true;
	var res = await $get('/projectService/getcontractall/0');
	state.list = res.result;
	state.loading = false;
};

// 获取合同履行类型
const getContractStatus = async () => {
	var res = await $get('/sysDictData/dataList?code=contract_status');
	state.contractStatusList = res.result;
}

// 去审核
const toAuditForm = row => {
	localStorage.setItem('audit_form_id', row.form.id);
	router.push({
		path: '/ProjectManage/auditForm'
	})
}

// 导出excel
function exportExcel() {
	var head = ['编号', '合同名称', '合同签订部门', '合同签订方名称', '签订时间', '主要内容', '合同金额', '合同履行情况\n(含结算金额、账面已付金额、未付金额)'];
	var data = state.list.map(item => {
		return [
			item.contrackCode, 
			item.contrackName, 
			item.signedDeprt, 
			item.providerName, 
			item.signedDate, 
			item.description, 
			item.contractAmount, 
			getLabelByValue(state.contractStatusList, item.contractStatus, '', 'value', 'code')
		];
	})
	data.unshift(head);

	var ws = XLSX.utils.aoa_to_sheet(data);

	// 设置单列宽度
	ws['!cols'] = [];
	for(let i = 0; i < head.length; i++) {
		ws['!cols'].push({wpx: i == head.length-1 ? 270 : 150})
	}
	// 设置单行高度
	ws['!rows'] = [];
	for(let i = 0; i < data.length; i++) {
		ws['!rows'].push({hpx: i == 0 ? 34 : 26})
	}

	// 创建一个样式对象
	const style = {
	  alignment: {
	    horizontal: "center", // 设置水平对齐方式为居中
	    vertical: 'center', 
	    wrapText: true
	  }
	};
	// 遍历工作表的单元格，并应用样式
	Object.keys(ws).forEach(cell => {
		if(cell.indexOf('!') != 0) {
			const cellRef = XLSX.utils.decode_cell(cell);
		  const cellStyle = ws[cell].s || {}; // 获取单元格的样式对象
		  cellStyle.alignment = style.alignment; // 应用样式的对齐方式
		  let num = cell.slice(1);
		  if(num <= 1) {
		  	cellStyle.font = { bold: true }
		  	// cellStyle.fill = { fgColor: { rgb: "FFFFAA00" } }
		  }
		  ws[cell].s = cellStyle; // 更新单元格的样式对象
		}
	});

	var wb = XLSX.utils.book_new();
	XLSX.utils.book_append_sheet(wb, ws, "sheet1");
	XLSX.writeFile(wb, "合同存档清单.xlsx");
}

// 导出合同文件
async function downFiles() {
	var res = await $get('/projectService/getcontractfiles');
	downloadByUrl({
		url: res.result
	})
}

</script>

<style lang="scss" scoped>
.t-wp {
	
}
</style>
